<template>
	<!-- 我觉得除了 LyScrollbar 以外其他的都不叫封装 -->
	<div class="ly-fcenter" :style="{ 
		flex: flex,
		margin: mar ? lyMar : '',
		padding: pad ? lyPad : '',
		padding: wrap ? wlyWrap : '',
	}">
	
		<span v-if="clear === ''">
			<slot></slot>
		</span>
		
		<slot v-else></slot>
		
	</div>
</template>

<script>
	export default {
		props: {
			'flex': String,
			'pad': String, 
			'mar': String,
			'wrap': String,
			'clear': String,
		},
		computed:{
			lyMar(){
				return this.updIng(this.mar, 'mar')
			},
			lyPad(){
				return this.updIng(this.pad, 'pad')
			},
			lyWrap(){
				if(this.wrap === '') return 'wrap'
				else return ''
			}
		},
		methods:{
			updIng(data, res){
				var str = '';
				const info = data.split(' ')
				for(var i in info){
					str += info[i]+'px '
				}
				
				return str
			}
		}
	}
</script>

<style scoped>
	div{
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>
